<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogVisible"
    :lock-scroll="true"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    top="20px"
    width="720px"
  >
    <el-form :model="supply" :rules="rules" labelPosition="top" ref="form" class="custom-form">
      <el-form-item label="供应商名称:" prop="name">
        <el-row :gutter="20">
          <el-col :span="10">
            <el-input v-model="supply.name" placeholder="输入分类名称"></el-input>
          </el-col>
          <el-col :span="14">
            <span>填写商品分类名称，不能为空</span>
          </el-col>
        </el-row>
      </el-form-item>

      <el-form-item label="供应商网址:">
        <el-row :gutter="20">
          <el-col :span="10">
            <el-input v-model="supply.url" placeholder="输入供应商的网址"></el-input>
          </el-col>
          <el-col :span="14">
            <span>填写供应商的网址</span>
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="是否显示:">
        <el-row :gutter="20">
          <el-col :span="10">
            <el-radio v-model="supply.isShow" :label="1">是</el-radio>
            <el-radio v-model="supply.isShow" :label="0">否</el-radio>
          </el-col>
          <el-col :span="14">
            <span>是否在供应商选择列表中显示</span>
          </el-col>
        </el-row>
      </el-form-item>

      <el-form-item label="供应商描述:">
        <el-row :gutter="20">
          <el-col :span="10">
            <el-input type="textarea" v-model="supply.descript" :rows="4" placeholder="请输入对供应商的描述"></el-input>
          </el-col>
          <el-col :span="14">
            <span>该供应商的描述信息</span>
          </el-col>
        </el-row>
      </el-form-item>
    </el-form>
    <div slot="footer">
      <el-button type="primary" @click="submitForm"><i class="fa fa-save"></i> 确认保存</el-button>
      <el-button type="success" @click="closed"><i class="fa fa-sign-out"></i> 关闭</el-button>
    </div>
  </el-dialog>

</template>

<script>
  import Dialog from 'src/components/common/js/dialog-mix'
  import AdminService from 'src/service/admin'

  export default {
    name: 'AdminSupplyEdit',
    mixins: [Dialog],
    data() {
      return {
        supply: {
          name: '',
          url: '',
          isShow: 1,
          descript: ''
        },
        rules: {
          name: [
            {required: true, message: '请输入供应商名称', trigger: 'blur'}
          ],
        }
      }
    },
    watch: {
      value: function (newValue, oldValue) {
        if (newValue == null) {
          this.supply =
            {
              name: '',
              isShow: 1,
              values: []
            }
        } else {
          this.supply = newValue;
        }
      }
    },
    props: {
      value: {
        type: Object
      }
    },
    methods: {
      submitForm: function () {
        const me = this
        this.$refs['form'].validate((valid) => {
          if (valid) {
            AdminService.saveSupply(this.supply).then(data => {
              if (data != null) {
                me.$message.success('添加供应商成功!')
                me.$emit('created', data.datas[0])
              }

            })
          } else {
            me.$message.warning('请正确填写信息!')
            return false
          }
        })
      },
      closed: function () {
        this.$emit('update:show', false)
      },
      restForm: function () {
        this.$refs['form'].resetFields()
      },
      initData: function () {
        return {
          name: '',
          url: '',
          descript: '',
          isShow: 1
        }
      }
    },
    beforeMount: function () {
      if (this.value == null) {
        this.supply = this.initData();
      } else {
        this.supply = this.value;
      }
    }
  }
</script>
